手动实现一个防抖和节流函数

防抖基本思想：(有可能不执行) 如果短时间内多次触发同一事件，那么只执行最后一次，或者只在开始时执行，从而防止多次执行

使用场景： 多用于用户注册时的手机号码验证和邮箱验证，只有等用户输入完前端才去进行验证是否通过 (可能由于该函数一直在重新计算事件而导致函数不执行）（公交）

函数代码如下：

const my_debounce = (func, delay) => {
  // 保存定时器
  let timer;
  // 返回一个新函数
  return (...args) => {
    // 新函数每次调用前先清除定时器,重新计时
    clearTimeout(timer);
    // 创建一个新的定时器，确保 func 函数只有在最后一次调用的 delay 毫秒后才会被执行
    timer = setTimeout(() => {
      func(...args);
    }, delay);
  };
};

节流基本思想：（一定会执行） 如果短时间内多次触发，那么在单位时间内只执行一次。

使用场景： 节流多数使用在监听页面元素的滚动事件或滑动事件 (节流即使再次触发高频事件，一到某个时间就会执行函数-------一定会执行函数。（地铁））

函数代码如下：

function my_throttle(fn, delay) {
  let timer;
  return (...args) => {
    if (timer) return;
    timer = setTimeout(() => {
      fn(...args);
      timer = null;
    }, delay);
  };
}